<template>
    <div>
        <Nav></Nav>
        <scroller :on-refresh="refresh"
                  :on-infinite="infinite"
                  style="padding-top: 44px;">
            <Item v-for="item in items" :key="item.title" :indexitem="item"></Item>
        </scroller>
    </div>
</template>
<script>
    import Nav from "./components/IndexListNav.vue";
    import Item from "./components/IndexListItem.vue";
    import Vue from "vue";
    import VueScroller from 'vue-scroller'
    Vue.use(VueScroller)

    export default {
        name: "IndexList",
        components: {
            Nav,
            Item,
        },
        data: function () {
            let items = [];
            return {
                items: items,
                top:-1,
                bottom:-1
            }
        },
        methods: {
            refresh: function (done) {
                let self = this;
                setTimeout(function () {
                    let start = self.top - 1;
                    for (let i = start; i > start - 10; i--) {
                        self.items.splice(0, 0, {
                            from: "Microsoft Windows",
                            author: "琴梨梨",
                            avatarUrl: "avatar.png",
                            title: "为什么" + i,
                            isContainPictures: true,
                            picturesUrl:
                                "https://pic3.zhimg.com/50/v2-27de05ed51c9a299dc569a6a4e92a16b_400x224.jpg",
                            summary:
                                "其实是有的，只是巨硬帮你管理了 这个技术叫SuperFetch（在win10最新测试版上已经改服务名为SysMain，实际上就是一个玩意） 很多用2G或者4G内存的穷苦人都会在搜索“svchost占内存过",
                            like: 400 + i,
                            comment: 71
                        });
                    }
                    self.top = self.top - 10;
                    done();
                }, 1500)
            },

            infinite: function (done) {
                let self = this;
                setTimeout(function () {
                    let start = self.bottom + 1;
                    for (let i = start; i < start + 10; i++) {
                        self.items.push({
                            from: "Microsoft Windows",
                            author: "琴梨梨",
                            avatarUrl: "avatar.png",
                            title: "为什么" + i,
                            isContainPictures: true,
                            picturesUrl:
                                "https://pic3.zhimg.com/50/v2-27de05ed51c9a299dc569a6a4e92a16b_400x224.jpg",
                            summary:
                                "其实是有的，只是巨硬帮你管理了 这个技术叫SuperFetch（在win10最新测试版上已经改服务名为SysMain，实际上就是一个玩意） 很多用2G或者4G内存的穷苦人都会在搜索“svchost占内存过",
                            like: 400 + i,
                            comment: 71
                        });
                    }
                    self.bottom = self.bottom + 10;
                    done();
                }, 1500)
            }
        },
        mounted: function () {
            for (let i = 0; i < 10; i++) {
                this.items.push({
                        from: "医院",
                        author: "张拉拉",
                        avatarUrl: "avatar.png",
                        title: (i + 1) + " 你听说过哪些骇人听闻的真实事件？",
                        isContainPictures: true,
                        picturesUrl:
                            "https://pic3.zhimg.com/80/v2-778267ac4a75c293c941aac75439f076_400x224.jpg",
                        summary: "这个很可怕 摸了应该整个火车都能熟了吧…",
                        like: 455 + i,
                        comment: 15
                    }
                    //, {
                    //     from: "Microsoft Windows",
                    //     author: "琴梨梨",
                    //     avatarUrl: "avatar.png",
                    //     title: "为什么 Windows 不提供内存文件系统？" + i,
                    //     isContainPictures: true,
                    //     picturesUrl:
                    //         "https://pic3.zhimg.com/50/v2-27de05ed51c9a299dc569a6a4e92a16b_400x224.jpg",
                    //     summary:
                    //         "其实是有的，只是巨硬帮你管理了 这个技术叫SuperFetch（在win10最新测试版上已经改服务名为SysMain，实际上就是一个玩意） 很多用2G或者4G内存的穷苦人都会在搜索“svchost占内存过",
                    //     like: 400 + i,
                    //     comment: 71
                    // }
                );
                this.top = 1;
                this.bottom = 10;
            }
        }
    };
</script>

<style scoped>
</style>
